<!DOCTYPE html>
<html>
{include file="public/header" /}
<body>
<div class="layui-fluid" id="app">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card" >
                <div class="layui-card-body">

                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">

                        <ul class="layui-tab-title">
                            <li onclick="go('index')"class="layui-this">项目管理</li>
                            <li onclick="go('add_pro')">新增项目</li>
                        </ul>

                        <div class="layui-tab-content" style="padding-left: 0px;padding-right: 0px">
                            <div class="layui-tab-item layui-show">

                                <div style="margin-top: 5px;margin-bottom: 10px">
                                    <div class="layui-btn-group layui-inline">
                                        <button class="layui-btn" onclick="del_all()">批量删除</button>
                                    </div>

                                    <div class="layui-inline" style="float: right">
                                        <form class="layui-form" action="">
                                            <div class="layui-form-item" style="margin-bottom: 0px">
                                                <div class="layui-inline" style="margin-right: 0px">
                                                    <div class="layui-input-inline" style="width: 200px;">
                                                        <input type="text" name="keyword" autocomplete="off"
                                                               placeholder="姓名/手机号"
                                                               class="layui-input">
                                                    </div>
                                                </div>

                                                <div class="layui-inline" style="margin-right: 0px">

                                                    <div class="layui-btn-group layui-inline" style="margin: 0px">
                                                        <!--此重置 仅仅是个跳转链接-->
                                                        <button  onclick="go('index')" class="layui-btn layui-btn-primary">重置</button>
                                                        <button class="layui-btn layui-btn-normal" lay-submit
                                                                lay-filter="formDemo"><i class="layui-icon">&#xe615;</i>查找
                                                        </button>

                                                    </div>


                                                </div>


                                            </div>
                                        </form>


                                    </div>


                                </div>
                                <div class="layadmin-trailer ">
                                    <table class="layui-table" lay-skin="line">

                                        <thead>
                                        <tr>
                                            <th style="width:5%"></th>
                                            <th style="width:5%">#ID</th>
                                            <th>户主</th>
                                            <th >城市</th>
                                            <th>详细地址</th>
                                            <th>户型</th>
                                            <th>开始时间</th>
                                            <th style="width:20%"></th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr v-for="(item,index) in items" :data_id="item.id">

                                            <td style="text-align: center">
                                                <input type="checkbox" class="vue_index" name="id" :value="item.id"
                                                       style="zoom: 150%">
                                            </td>
                                            <td>{{item.id}}</td>
                                            <td><span v-for="(it,i) in item.client" class="layui-btn layui-btn-sm layui-btn-normal">{{it.name}}</span></td>
                                            <td>{{item.sheng}}{{item.shi}}{{item.xian}}</td>
                                            <td>{{item.address}}</td>
                                            <td>{{item.house_type}}</td>
                                            <td>{{item.start_time}}</td>
                                            <td>

                                                <div class="layui-btn-group">
                                                    <button class="layui-btn layui-btn-sm layui-btn-primary"
                                                            onclick="edit(this)"  :data_id="item.id" :data_index="index">编辑
                                                    </button>
                                                    <button class="layui-btn layui-btn-sm layui-btn-primary"
                                                            onclick="stage(this)"  :data_id="item.id" :data_index="index">施工阶段
                                                    </button>
                                                </div>
                                            </td>

                                        </tr>
                                        </tbody>
                                    </table>


                                </div>
                                <div id="demo7"></div>

                            </div>


                        </div>
                    </div>


                </div>


            </div>

        </div>


    </div>
</div>


<script>

    var app = new Vue({
        el: '#app',
        data: {
            check: [],
            curr: 1,//当前页
            limit: 10,//当前页数据个数
            items: [],

        },
    });

    function init() {
        layer.load(2);
        $.get("{:url('index')}" , {page: app.curr, limit: app.limit},
            function (res) {
                layer.closeAll();
                app.items = res.data;
                console.log(res.data);
            }
        );
    }
    layui.use(['table','laypage', 'layer','form'], function () {
        var laypage = layui.laypage
            , layer = layui.layer;
        var table = layui.table;
        var form = layui.form;
        //完整功能
        laypage.render({
            elem: 'demo7'
            , count: "{$count}"  //数据总数
            , limits: [10, 20]
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
            , jump: function (obj) {
                console.log(obj)
                app.curr = obj.curr;
                app.limit = obj.limit;
                init();

            }
        });
        form.on('submit(formDemo)', function (data) {

            if (!data.field.keyword) {
                return false;
            }
            console.log(data.field.keyword);
            layer.load(2);
            $.get("{:url('project_search')}",{
                    keyword: data.field.keyword
                },
                function (res) {

                    layui.use(['laypage'], function () {
                        var laypage = layui.laypage;
                        //完整功能
                        laypage.render({
                            elem: 'demo7'
                            , count: res.total
                            , limits: [10, 20]
                            , layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
                            , jump: function (obj) {
                                console.log(obj)
                                app.curr = obj.curr;
                                app.limit = obj.limit;
                                layer.load(2);
                                $.get("{:url('project_search')}", {
                                        page: app.curr,
                                        limit: app.limit,
                                        keyword: data.field.keyword
                                    },
                                    function (res) {
                                        layer.closeAll();
                                        app.items= res.data;
                                        console.log(res.data);
                                    }
                                );
                            }
                        });
                    });
                }
            );
            return false;
        });
    });


    //获取下标（id）
    function getCheckBox() {
        var check = [];
        $.each($('input[type=checkbox]:checked.vue_index'), function () {
            check.push($(this).val());
        });
        return check;
    }

//将选中的项删除
    function del_all() {
        var ids = getCheckBox();
        if (ids.length > 0) {
            var index = layer.confirm('确认继续执行？', {
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.post('{:url("del_project_all")}', {ids: ids}, function (res) {
                    if (res.code == 1){
                        layer.msg(res.msg, {icon: 1});
                        $("input:checkbox").removeAttr("checked");
                        init();
                    }
                    layer.close(index);
                });
            }, function () {
                layer.close(index);
            });
        }

    }
    function edit(that) {
        var data_id = $(that).attr('data_id');
        var path ="{:url('edit_project')}?id=" + data_id;
        go(path);

    }
    function stage(that) {
        var data_id = $(that).attr('data_id');
        var path = "{:url('stage')}?id=" + data_id;
        go(path);

    }

</script>


</body>
</html>




